<!--
 * @Author: coman
 * @LastEditors: coman
 * @Date: 2020-06-20 11:38:00
 * @motto: No pain,No gain
 * @LastEditTime: 2020-06-20 14:36:20
--> 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        body{
      height: 5000px;
    }
    #btn{
        position: fixed;
      right: 50px;
      bottom: 30px;
        display: none;
    }
    </style>
   
</head>
<body>
    <button id="btn">回到顶部</button>
    <script>
       
        window.onscroll=function(){
            if(scrollY<1000){
                btn.style.display="none";
            }
            if(scrollY>=1000){
            btn.style.display="block";
            // console.log(scrollY);
        }
        }
        

        var timer;
       btn.onclick=function(){

       
          timer= setInterval(function(){
            
            
               if(scrollY<=0){
                   clearInterval(timer);
               }
               if(scrollY>0)
               {window.scrollTo({top:(scrollY-10)})}
               console.log(1);
               
           },10)
        //    window.scrollTo({top:0});
      
       }
    </script>
</body>
</html>